<!DOCTYPE html>
<html>

<head>
    <title>查询作者</title>
    <meta charset="UTF-8">
    <script src="/js/jquery.min.js"></script>
</head>
<body>

<h2>查询作者</h2>
<form>
    作者：<input type="text" id="authorName">
    <input type="button" value="查询" onclick="loadAuthor()">
</form>

<div id="queryResult">
</div>


<script>
    function loadAuthor() {
        // 发送异步请求
        $.ajax({
            type : 'GET',
            dataType : 'JSON',
            url : '/author/queryAuthor.do',
            data : {
                authorName : $('#authorName').val()
            },
            success : function (result) {
                if (result.code != 1000) {
                    alert(result.message);
                    if (result.code == 5555) {
                        window.location.href = '/';
                    }
                    return;
                }

                var author = result.data;
                var authorHtml = '    <table>\n' +
                    '        <tr>\n' +
                    '            <td>ID</td>\n' +
                    '            <td>姓名</td>\n' +
                    '            <td>年龄</td>\n' +
                    '            <td>性别</td>\n' +
                    '            <td>性别国籍</td>\n' +
                    '        </tr>\n' +
                    '        <tr>\n' +
                    '            <td>'+author.id+'</td>\n' +
                    '            <td>'+author.username+'</td>\n' +
                    '            <td>'+author.age+'</td>\n' +
                    '            <td>'+author.sex+'</td>\n' +
                    '            <td>'+author.nationality+'</td>\n' +
                    '        </tr>\n' +
                    '    </table>';

                $('#queryResult').html(authorHtml);//会渲染，也就是会解析html标签
                // $('#queryResult').text(authorHtml);//不会渲染，直接把字符串展示在页面
            }

        });
    }
</script>



</body>
</html>